<template>
	<view class="pagesBoxLogin">
		<view class="content_all">
			<view class="content_1 content">
				<view class="relative">
					<view class="header">
						hello !
					</view>
					<view class="huanyin">欢迎使用<text class="firmName">小蝌蚪软件</text>后台管理系统！</view>
				</view>
				<!-- 第一步 公司名称 -->
				<view class="list" v-if="nowShowType==0">
					<view class="list-call" >
						<view class="lefts">
							<img class="img" src="../../static/img/setting.png"></img>
							<text selectable="true"  class="title">仓库账号</text>
						</view>
						<view class="biaoti" >
							<input v-model="firmArr.appid" @confirm="loadHeader"/>
							<view class="dlbutton" @click="loadHeader">下一步</view>
						</view>
						
					</view>
				</view>
				<!-- 选择账号登录 -->
				<view class="list" v-if="nowShowType==1">
					<!-- 返回第一步 -->
					<img class="close" src="../../static/img/close.png" @click="nowShowType=0"></img>
					
					<view class="list-call" >
						<view class="lefts">
							<img class="img" src="../../static/shilu-login/phone.png"></img>
							<text selectable="true"  class="title">登陆账号</text>
						</view>
						<view class="biaoti" >
							<uni-data-select
							class="font16"
							@change="(e)=>{$global.setStorageRoute('loginName',e)}"
							:localdata="headerSearch.headerList"
							v-model="login.id"
							placeholder="选择账号"
							></uni-data-select>
						</view>
					</view>
					<view class="list-call" >
						<view class="lefts">
							<img class="img" src="../../static/shilu-login/block.png"></img>
							<text selectable="true"  class="title">登陆密码</text>
						</view>
						<input class="biaoti" 
						v-model="login.password" 
						@confirm="confirm"
						type="password" 
						maxlength="32" 
						placeholder="输入密码" 
						password="true" />
					</view>
				</view>
				<view class="dlbutton" hover-class="dlbutton-hover" @tap="bindLogin()" v-if="nowShowType==1">
					登 录
				</view>
			</view>
			<img src="https://www.kingdee.com/r/cms/www/default/v02/images/ERP/bg.png" mode="aspectFill" style="width: 100%;height: 100%;"></img>
		</view>
		
		<!-- 底部公司信息与版权 -->
		<view class="footer">
			<view class="footer-content">
				<view class="company-info">
					<view class="company-name">小蝌蚪软件</view>
					<view class="contact-info">
						<text class="contact-item">微信：chongzi_0000</text>
						<text class="contact-item">邮箱：chong_zi_168@163.com</text>
						<text class="contact-item">官网：{{$common.baseUrl.host}}</text>
					</view>
				</view>
				<view class="copyright">
					Copyright © 2019 东莞市小蝌蚪网络科技有限公司 版权所有
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	
	export default {
		onShow(){
		},
		data() {
			return {
				login:{
					id:'',
					password:'',
				},
				headerSearch:{//左边的树形框 搜索
					headerList:[],
				},
				firmArr:{
					list:[],
					appid:'',
					name:''
				},
				nowShowType:0,//窗口可见 0=第一步 公司名称  1= 选择账号登录可见
			};
		},
		onLoad(res) {
			var token = this.$common.checkLogin();
			if(token!=false){
				this.$common.setToken(token)
				
				this.$global.setStorageRoute('token',token)
				this.$common.redirectTo('/pages/admin/admin')
				return 
			}
			
			// this.getFirm()
			if(res.appid==undefined){
				this.firmArr.appid = this.$global.getStorageRoute('firmArrId')
			}else{
				//体验接口进来的，默认填入appid
				this.firmArr.appid = res.appid
				this.$global.setStorageRoute('firmArrId',this.firmArr.appid)
			}
			if(this.firmArr.appid==""){
				return
			}
			if(res.loginName==undefined || res.password==undefined){
				this.login.id = this.$global.getStorageRoute('loginName')
			}else{
				//体验接口进来的，默认填入账号密码
				this.login.id = res.loginName
				this.login.password = res.password
			}
			// this.loadHeader()
			this.loadHeader()
		},
		methods: {
		
			/**
			 * 获取仓库
			*/
			// getFirm(){
			// 	var that = this
			// 	that.$common.get_request(
			// 		{type:'getFirm'},
			// 		(res)=>{
			// 			that.firmArr.list = res.list
			// 		}
			// 	);
			// },
			/**
			 * 读取内部员工
			 * type : goods_list|goods_search
			 * 
			*/
			loadHeader(){
				var that = this
				if(that.firmArr.appid==''){
					that.$common.toast("请输入仓库ID后再试！")
					return
				}
				
				that.$common.get_request(
					{
						type:'firmUser',
						id:that.firmArr.appid,
						isLogin:1,
					},
					(res)=>{
						that.headerSearch.headerList = res.list
						that.firmArr.appid = res.firm_id
						that.firmArr.name = res.name
						//隐藏输入仓库窗口
						that.nowShowType = 1
						
						that.$common.SetFirmId(res.firm_id)
					}
				);
			},
			/**
			 * 监听回车键后发送登陆
			 * 
			*/
			confirm(e){
				this.bindLogin()
			},
			/**
			 * 登陆
			 * 
			*/
		    bindLogin() {
				var that = this
				let id = that.login.id.trim()
				let pass = that.login.password.trim()
				if(id.length==0 || pass.length==0){
					that.$common.toast("清输入账号密码后再试！")
					return 
				}
				that.$common.get_request(
					{
						type:'login',
						id:id,
						password:pass,
						fid:that.firmArr.appid,
					},
					(res)=>{
						that.$global.setStorageRoute('firmArrId',that.firmArr.appid)
						that.$global.setStorageRoute('firm_id',res.firm_id)
						that.$global.setStorageRoute('appid',res.firm_id)
						that.$common.setToken(res.token)
						that.$global.setStorageRoute('token',res.token)
						that.$global.setStorageRoute('admin',res.admin)
						that.$routeData.loadRoute(()=>{
							that.$common.redirectTo(`/pages/admin/admin?appid=${that.firmArr.appid}`)
						}) 
					}
				);
		    }
		}
	}
</script>

<style>
	.content_all{
		height: 100%;
		width: 100%;
		min-width: 1110px;
		overflow: hidden;
	}
	.content_1{
		min-width: 300px;
		width: auto;
		z-index: 1;
		position: absolute;
		left: 50%;
		top: 50%;
		-webkit-transform: translate(0%, -50%);
		transform: translate(-50%, -50%);
		background-color: #fff;
		padding: 120rpx;
		border-radius: 8px;
		box-shadow: 0 5px 40px #3333330d;
	}
	.content {
		display: flex;
		flex-direction: column;
		/* justify-content:center; */
		/* align-items: center; */
	}
	.firmName{
		margin: auto 5px;
		font-size: larger;
	}
	.header {
		font-size: 50px;
		color: #0f66e040;
		min-width: 500px;
		padding-bottom: 35px;
	}
	.list {
		display: flex;
		flex-direction: column;
		padding-top: 40px;
		/* padding-left: 70px;
		padding-right: 70px; */
	}
	.list-call{
		padding-left: 10px;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		color: #333333;
		margin-bottom: 3px;
		background-color: #b3b3b30d;
		margin-bottom: 20px;
		border-radius: 8px;
		border: solid 1px #bbb;
	}
	.list-call .lefts{
		height: 50px;
		display: flex;
		min-width: 95px;
	}
	.list-call text{
		padding-right: 5px;
		color: #4d4d4d;
		font-size: 16px;
	}
	.list-call .img{
		width: 25px;
		height: 25px;
		display: flex;
		justify-content: center;
		flex-direction: column;
		margin: auto;
	}
	.list-call .title{
		display: flex;
		justify-content: center;
		flex-direction: column;
		margin: auto;
		font-size: 16px;
	}
	.list-call .biaoti{
		flex: 1;
		text-align: left;
		font-size: 16px;
		min-height: 30px;
		padding: 0px 0px 0px 15px;
		height: 60px;
		display: flex;
		border-left: solid 1px #bbb;
	}
	.list-call .biaoti input{
		height: 100%;
		width: 100%;
	}
	.dlbutton {
		color: #FFFFFF;
		font-size: 18px;
		width: 200px;
		height: 60px;
		background-color: #0f66e0;
		align-items: center;
		display: flex;
		justify-content: center;
		text-align: center;
		margin: auto;
		font-weight: 600;
		border-radius: 8px;
	}
	.dlbutton hover {
		background-color: #1890cc;
	}
	.close{
		position: absolute;
		right: 5px;
		top: 5px;
		width: 30px;
		height: 30px;
		transition: all 0.2s;
	}
	.close:hover {
		cursor: pointer;
	    transform: rotate(90deg);
	}
	.pagesBoxLogin{
		height: 100%;
		width: 100%;
		position: absolute;
		overflow: auto;
		background-color: #f7f7f7;
	}
	.huanyin{
		font-size: 32px;
		position: absolute;
		bottom: 0px;
		white-space: nowrap;
		left: 50%;
		-webkit-transform: translate(-50%, 0px%);
		transform: translate(-50%, 0px);
	}
	
	/* 底部样式 */
	.footer {
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		background-color: rgba(255, 255, 255, 0.85);
		box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
		z-index: 10;
		padding: 15px 0;
	}
	
	.footer-content {
		max-width: 1200px;
		margin: 0 auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	
	.company-info {
		margin-bottom: 8px;
	}
	
	.company-name {
		font-size: 16px;
		font-weight: 600;
		color: #0f66e0;
		margin-bottom: 5px;
	}
	
	.contact-info {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
		font-size: 14px;
		color: #666;
	}
	
	.contact-item {
		white-space: nowrap;
	}
	
	.copyright {
		font-size: 12px;
		color: #999;
	}
	
	/* 响应式调整 */
	@media (max-width: 768px) {
		.contact-info {
			flex-direction: column;
			gap: 5px;
		}
		
		.footer-content {
			padding: 0 15px;
		}
	}
</style>